<template>
  <l-layout class="l-tab-page" v-if="!lr_loadPage">
    <l-panel>
      <template #toolRight>
        <l-tool-btns :refreshClick="init" @click="handleAdd()"> </l-tool-btns>
      </template>
      <l-table
        ref="mainTable"
        :loading="tableLoading"
        :columns="columns"
        :dataSource="tableData"
      >
        <l-table-btns
          :isAuth="false"
          :btns="tableBtns"
          @click="lr_handleTableBtnClick"
        ></l-table-btns>
      </l-table>
    </l-panel>

    <!--表单-->
    <l-dialog
      :title="$t(formTitle)"
      :visible.sync="formVisible"
      :height="400"
      :width="600"
      @ok="handleSave"
      @close="handleCloseForm"
      @opened="handleOpenedForm"
    >
      <my-form
        ref="form"
        :fileInfoId="fileInfoId"
        :isFolder="isFolder"
      ></my-form>
    </l-dialog>
  </l-layout>
</template>

<script>
import MyForm from "./form";
const api = window.$api.system.file;
export default {
  components: {
    MyForm,
  },
  props: {
    fileInfoId: String,
    isFolder: Number,
  },
  data() {
    return {
      // 表格参数
      tableLoading: false,
      tableData: [],
      columns: [
        {
          label: "授权角色",
          prop: "f_ObjId",
          width: 120,
          align: "left",
          dataType: "role",
        },
        {
          label: "到期日期",
          prop: "f_Time",
          width: 120,
          align: "center",
          dataType: "datetime",
          format: "yyyy-MM-dd",
        },
        {
          label: "授权类型",
          prop: "f_AuthType",
          minWidth: 120,
          align: "left",
          dataType: "mydata",
          options: [
            { label: "查看", value: "01" },
            { label: "上传", value: "02" },
            { label: "下载", value: "03" },
            { label: "移动", value: "04" },
            { label: "删除", value: "05" },
            { label: "还原", value: "06" },
            { label: "授权", value: "07" },
            { label: "重命名", value: "08" },
            { label: "彻底删除", value: "09" },

            { label: "文件夹新增", value: "10" },
            { label: "文件夹删除", value: "11" },
            { label: "文件夹移动", value: "12" },
            { label: "文件夹授权", value: "13" },
            { label: "文件夹上传", value: "14" },
            { label: "文件夹重命名", value: "15" },
          ],
        },
      ],
      tableBtns: [
        { prop: "Edit", label: this.$t("编辑"),width:100 },
        { prop: "Delete", label: this.$t("删除"),width:100 },
      ],

      // 表单参数
      formVisible: false,
      formTitle: "",
      formEditRow: null,
      formEdit: false,
    };
  },
  methods: {
    init() {
      this.loadTableData();
    },
    hanleSearch() {},
    async loadTableData() {
      this.tableLoading = true;
      let data = await this.$awaitWraper(api.getAuthList(this.fileInfoId));
      this.tableData = data || [];
      this.tableLoading = false;
    },

    handleAdd() {
      this.formEdit = false;
      this.handleShowForm("新增");
    },
    handleEdit($index, row) {
      this.formEdit = true;
      this.formEditRow = row;
      this.handleShowForm("编辑");
    },
    handleDelete($index, row) {
      this.$confirm(
        this.$t("此操作将永久删除该数据, 是否继续?"),
        this.$t("提示"),
        {
          confirmButtonText: this.$t("确定"),
          cancelButtonText: this.$t("取消"),
          type: "warning",
        }
      )
        .then(async () => {
          this.tableData.splice($index, 1);
          await api.deleteAuth(row.f_Id);
          this.$message({
            type: "success",
            message: this.$t("删除成功!"),
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: this.$t("已取消删除!"),
          });
        });
    },

    async handleSave(showLoading, hideLoading) {
      showLoading("保存数据中...");
      if (await this.$refs.form.validateForm()) {
        const res = await this.$refs.form.saveForm({
          keyValue: this.formEdit ? this.formEditRow.f_Id : "",
          isEdit: this.formEdit,
        });
        if (res) {
          const msg = this.formEdit ? this.$t("更新成功!") : this.$t("新增成功!");
          this.$message({
            type: "success",
            message: this.$t(msg),
          });
          this.loadTableData();
          this.formVisible = false;
        }
      }
      hideLoading();
    },

    handleShowForm(text) {
      this.formTitle = text;
      this.formVisible = true;
    },
    async handleOpenedForm() {
      if (this.formEdit) {
        this.$refs.form.setForm(this.formEditRow);
      }
    },
    handleCloseForm() {
      this.$refs.form.resetForm();
    },
  },
};
</script>
